<style>
    .contribute-status a {
        cursor: pointer;
        padding: 0 10px;
        display: inline-block;
        color: var(--grey-font-color);
        border-right: 1px solid var(--max-grey-font-color);
    }

    .contribute-status a:hover {
        color: var(--primary-color);
    }

    .contribute-status a.primary {
        color: var(--primary-color);
    }

    .contents .items {
        padding: 20px 10px;
        border-bottom: 1px dashed var(--max-grey-font-color);

    }

    .contents .items:hover {
        background-color: #F2F3F5;
    }

    .contents .items .title {
        font-size: 16px;
        font-weight: 600;
    }

    .contents .items .desc {
        margin-top: 10px;
        color: var(--grey-font-color);
    }

    .contents .unpass {
        padding: 15px;
        margin-top: 10px;
        background-color: #FCF8E3;
        color: #c09853;
    }

    .contents .items .rc-dropdown-content {
        min-width: unset;
        font-weight: normal;
        width: 60px;
    }

    .contents .items .rc-dropdown-content li {
        height: 30px;
        line-height: 30px;
        padding: 0 5px;
        font-size: 14px;
    }

    .contents .items .rc-dropdown-content li:hover {
        background-color: #F2F3F5;
        border-radius: 4px;
    }

    .contents .items .desc span {
        padding-right: 15px;
    }

    .contents .items .desc span:not(:first-child) {
        padding-left: 15px;
    }

    .contents .items .desc span:not(:last-child) {
        border-right: 1px solid var(--max-grey-font-color);
    }
</style>
<div class=" rc-pannel rc-pagepadding ">
    <div class="rc-pannel-body">


        <div class="layui-tab " lay-filter="tab_contribute">
            <div class="layui-tab-brief rc-flex rc-flex-between rc-flex-item-center">
                <ul class="layui-tab-title" id="contribute_tab_li" style="flex: 1;">

                    <?php
                    foreach ($contributeModels as $key => $model) {
                    ?>
                        <li class="<?php echo $key == 0 ? 'layui-this' : '' ?>" lay-id="<?php echo $model['id'] ?>|<?php echo $model['tablename'] ?>"><?php echo $model['title'] ?></li>
                    <?php
                    }
                    ?>

                </ul>
                <div style="width: 200px;">
                    <div class="layui-input-group">

                        <input type="text" placeholder="这里搜索内容" class="layui-input" id="content_keyword">

                        <div class="layui-input-split layui-input-suffix" style="cursor: pointer;">
                            <i class="layui-icon layui-icon-search" id="search_btn"></i>


                        </div>

                    </div>
                </div>

            </div>


            <div class="rc-flex rc-flex-between rc-flex-item-center" style="margin-top: 10px;">
                <div class="contribute-status">
                    <a class="primary" status="0">待审(<span id="contributePendingCount">0</span>)</a>
                    <a status="1">已发布(<span id="contributePublishCount">0</span>)</a>
                    <a status="-1">未通过(<span id="contributeUnpassCount">0</span>)</a>
                </div>

                <div class="rc-dropdown">

                    <?php
                    if (count($contributeCates) == 1 && !isset($contributeCates[0]['children'])) {
                    ?>
                        <a href="/app/cms/uc/Contribute/add?siteid=<?php echo $contributeCates[0]['siteid'] ?>&cid=<?php echo $contributeCates[0]['id'] ?>" class="layui-btn layui-btn-primary  rc-dropbtn"><i class="iconfont icon-bianji "></i> 投稿</a>
                    <?php
                    } else {
                    ?>
                        <a class="layui-btn layui-btn-primary  rc-dropbtn"><i class="iconfont icon-bianji "></i> 投稿</a>
                        <div class="rc-dropdown-content layui-anim layui-anim-downbit layui-panel" style="width: 400px;">
                            <div class=" rc-flex">
                                <div> <input type="text" placeholder="选择栏目开始投稿" name="pid" id="pid" autocomplete="off" value="" lay-verify="required" class="layui-input" title="分类名称" /></div>
                                <div><button class="layui-btn layui-btn-primary rc-margin-left-default " id="start_contribute">开始投稿</button></div>
                            </div>
                        </div>
                    <?php
                    }

                    ?>

                </div>
            </div>

            <div class="layui-tab-content ">
                <div class="layui-tab-item layui-show">
                    <div class="contents" id="contents">


                    </div>
                </div>

            </div>

        </div>
    </div>

    <div class="rc-pannel-footer">
        <div id="pagebar"></div>
    </div>
</div>
<script src="/static/uc/lib/layui/modules/cascader/cascader.js"></script>
<link href="/static/uc/lib/layui/modules/cascader/cascader.css" rel="stylesheet">
<script>
    layui.use(function() {
        var layer = layui.layer;
        var form = layui.form;
        var element = layui.element;
        var laypage = layui.laypage;
        var layCascader = layui.layCascader;

        var el_cascaderdata = '<?php echo json_encode($contributeCates, JSON_UNESCAPED_UNICODE) ?>';
        var el_cascaderdata_obj = eval("(" + el_cascaderdata + ")");

        var el_cascader = layCascader({
            elem: '#pid',
            filterable: true,
            options: el_cascaderdata_obj,
            clearable: true,
            placeholder: '选择栏目后投稿',
            props: {
                value: 'id',
                label: 'title',
                checkStrictly: true,
            }
        });

        $('#search_btn').click(function() {
            selContent();

        });



        $('#start_contribute').click(function() {

            var cid = el_cascader.getCheckedValues();
            console.log(cid);
            if (cid == 0 || cid == '' || cid == null) {
                toastr_error('请选择栏目');
                return;
            }

            var cate = el_cascader.getCheckedNodes();
            var siteid = cate.data.siteid;
            var cid = cate.data.id;

            window.location.href = '/app/cms/uc/Contribute/add?siteid=' + siteid + '&cid=' + cid;
        });


        element.on('tab(tab_contribute)', function(data) {

            selContent();
        });

        $('.contribute-status').find('a').click(function() {
            $('.contribute-status').find('.primary').removeClass('primary');
            $(this).addClass('primary');
            selContent();
        });


        //渲染分页条
        var nowpage = 1;

        function renderPagebar(total) {
            if (total <= 0) {
                $('#pagebar').parent('.rc-pannel-footer').hide();
            } else {
                $('#pagebar').parent('.rc-pannel-footer').show();
            }
            laypage.render({
                elem: 'pagebar',
                limit: 10,
                curr: nowpage,
                count: total, // 数据总数
                jump: function(obj, first) {
                    if (!first) {

                        nowpage = obj.curr;
                        selContent();
                    }

                }
            });

        }

        selContent();

        function selContent() {
            layer.load();
            var contentmodel = $('#contribute_tab_li').find('.layui-this').attr('lay-id');
            var mid_tablename = contentmodel.split('|');
            var status = $('.contribute-status').find('.primary').attr('status');
            var title = $('#content_keyword').val();
            $.ajax({
                url: '/app/cms/uc/Contribute/index?optype=selcontent', //请求路径
                type: "POST", //请求方式
                data: {
                    mid: mid_tablename[0],
                    tablename: mid_tablename[1],
                    status: status,
                    title: title,
                    page: nowpage
                },
                success: function(data) {
                    if (data.code == 0) {
                        var contributes = '';
                        $.each(data.data.items, function(i, v) {
                            var opinion = '';
                            if (v.opinion != '') {
                                opinion = '<div class="unpass">' + v.opinion + '</div>';
                            }
                            contributes += `
                                <div class="items">
                                     <div class="title rc-flex rc-flex-between">
                                        <div> ` + v.title + `</div>
                                        <div class="rc-dropdown">
                                            <i class="layui-icon layui-icon-more rc-dropbtn"></i>
                                            <div class="rc-dropdown-content layui-anim layui-anim-downbit layui-panel">
                                                <ul>
                                                    <li> <a href="/app/cms/uc/Contribute/edit?id=${v.id}&cid=${v.cid}&siteid=${v.siteid}">编辑</a> </li>
                                                    <li><a id="${v.id}" cid="${v.cid}" siteid="${v.siteid}" class="deleteContribute" href="javascript:;">删除</a>  </li>

                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                    ` + opinion + `
                                    <div class="desc">
                                        <span>` + v.createtime + `</span>
                                        <span>
                                            ` + v.viewscount + `阅读 · ` + v.praise + `点赞 · ` + v.comment + `评论 · ` + v.collect + `收藏
                                        </span>
                                        <span>
                                            ` + v.ancestorsCatetitle + `
                                        </span>
                                    </div>
                                </div>
                            `;
                        });
                        $('#contributePendingCount').html(data.data.contributePendingCount);
                        $('#contributePublishCount').html(data.data.contributePublishCount);
                        $('#contributeUnpassCount').html(data.data.contributeUnpassCount);
                        $('#contents').html(contributes);
                        renderPagebar(data.data.total);
                    }
                },
                error: function() {

                },
                complete: function() {
                    layer.closeAll();
                }

            });
        }




        //删除稿件
        $(document).on('click', '.deleteContribute', function() {
            var id = $(this).attr('id');
            var cid = $(this).attr('cid');
            var siteid = $(this).attr('siteid');

            layer.confirm('确定要删除么？', {

                btn: ['确定', '关闭'] //按钮

            }, function(index, layero, that) {

                layer.load(1);
                $.ajax({
                    url: '/app/cms/uc/Contribute/delete?id=' + id + '&cid=' + cid + '&siteid=' + siteid, //请求路径
                    type: "POST", //请求方式

                    success: function(data) {
                        if (data.code == 0) {
                            toastr_success('删除成功');
                            selContent();
                        } else {
                            toastr_error(data.message);

                        }

                    },
                    error: function() {

                    },
                    complete: function() {
                        layer.closeAll();
                    }

                });


            });
        });
    });
</script>